{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="{% static 'css/bootstrap.css' %}" rel="stylesheet">
    <link href="{% static 'css/style.css' %}" rel="stylesheet">
    <script src="{% static 'js/jquery.min.js' %}"></script>
    <script src="{% static 'js/bootstrap.min.js' %}"></script>
</head>
<body>
<div class="container-top">
    <div class="row">
        <div class="col-md-6">
            <a>
                <img class="img-responsive" src="{% static 'img/logo.jpg' %}" alt="">
            </a>
        </div>
        <div class="col-md-3 hidden-xs">
            <a class="phone ant">
                <span class="glyphicon glyphicon-phone"></span>电话：400 1111 0000 &nbsp;&nbsp;
            </a>
        </div>
        <div class="col-md-3 hidden-xs">
            <a class="mail ant">
                <span class="glyphicon glyphicon-envelope"></span>邮箱：hengDa@126.com &nbsp;&nbsp;
            </a>
        </div>
    </div>
</div>
<div class="line"></div>
<nav class="navbar navbar-default" role="navigation">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example"
                    aria-expanded="false">
                <span>导航栏</span>
            </button>
        </div>
        <div class="collapse navbar-collapse" id="bs-example">
            <ul class="nav navbar-nav" style="width:100%;">
                <li class="nav-top">
                    <a href="{% url 'home' %}">首页</a>
                </li>
                <li class="dropdown nav-top" id='about'>
                    <a href="#" class="dropdown-toggle on" data-toggle="dropdown">
                        公司简介</a>
                    <ul class="dropdown-menu">
                        <li><a id="survey" href="{% url 'aboutApp:survey' %}">企业概况</a></li>
                        <li><a id="honor" href="{% url 'aboutApp:honor' %}">荣誉资质</a></li>
                    </ul>
                </li>

                <li class="dropdown nav-top" id='news'>
                    <a href="#" class="dropdown-toggle on" data-toggle="dropdown">
                        新闻动态</a>
                    <ul class="dropdown-menu">
                        <li><a id="company" href="{% url 'newsApp:news' 'company' %}">企业要闻</a></li>
                        <li><a id="industry" href="{% url 'newsApp:news' 'industry' %}">行业新闻</a></li>
                        <li><a id="notice" href="{% url 'newsApp:news' 'notice' %}">通知公告</a></li>
                    </ul>
                </li>
                <li class="dropdown nav-top" id='products'>
                    <a href="#" class="dropdown-toggle on" data-toggle="dropdown">
                        产品中心</a>
                    <ul class="dropdown-menu">
                        <li><a id="robot" href="{% url 'productsApp:products' 'robot' %}">家用机器人</a></li>
                        <li><a id="monitor" href="{% url 'productsApp:products' 'monitor' %}">智能监控</a></li>
                        <li><a id="face" href="{% url 'productsApp:products' 'face' %}">人脸识别解决方案</a></li>
                    </ul>
                </li>
                <li class="dropdown nav-top" id='service'>
                    <a href="#" class="dropdown-toggle on" data-toggle="dropdown">服务支持</a>
                    <ul class="dropdown-menu">
                        <li><a id="download" href="{% url 'serviceApp:download' %}">资料下载</a></li>
                        <li><a id="platform" href="{% url 'serviceApp:platform' %}">人脸识别开放平台</a></li>
                    </ul>
                </li>
                <li class="nav-top" id='science'>
                    <a href="{% url 'scienceApp:science' %}">科研基地</a>
                </li>
                <li class="dropdown nav-top" id='employ'>
                    <a href="#" class="dropdown-toggle on" data-toggle="dropdown">
                        人才招聘</a>
                    <ul class="dropdown-menu">
                        <li><a id="contact" href="{% url 'contactApp:contact' %}">欢迎咨询</a></li>
                        <li><a id="recruit" href="{% url 'contactApp:recruit' %}">加入恒达</a></li>
                    </ul>
                </li>
            </ul>
        </div>
    </div>
</nav>
</body>
<script>
  const dom = $('#{{active_menu}}')
  dom.addClass('active');
  dom.find('a').each(function () {
    const a = $(this)
    if (!a[0].id) return
    else if (a[0].id !== '{{sub_menu}}') a.addClass('default')
  });

  $(function () {
    $(".dropdown").mouseover(function () {
      $(this).addClass("open");
    });
    $(".dropdown").mouseleave(function () {
      $(this).removeClass("open");
    });
  });
</script>
</html>